{% extends "base.html" %}
{% load static %}
{% block content %}
    <div class="users_box">
        <div class="users_box_top">会员邮箱注册</div>
        <div class="users_box_bottom">
            <div class="box_bottom_left"><img src="{% static 'buyer/images/huiyuan.jpg' %}"/></div>
            <div class="box_bottom_right" style="float:left;margin-left:20px">
                <!-- 1.需完善form标签的action属性 -->
                <form method="post" action="/Buyer/phone_register/">
                    {% csrf_token %}
                    <div>
                        邮&nbsp;箱：<input type="text" name="plonename" placeholder="请输入手机号" required="" id="plone" class="input"/>
                        <!-- 2.需传入视图函数传来的报错提示信息 -->
                        <span>{{ error_msg.plone }}</span>
                    </div>
                    <div>
                        验证码：<input type="text" name="code" placeholder="请输入验证码" required="" style='width: 150px'
                                   class="input" id="code"/>

                        <input class="huoqu" id="zphone" type="button" value=" 获取验证码 ">
                        <!-- 3.需传入视图函数传来的报错提示信息
{#                                参考：<span>{{ error_msg.yzm_sx }}{{ error_msg.yzm_error }}</span>  #}
                         -->
                        <span>{{ error_msg.yzm_sx }}{{ error_msg.yzm_error }}</span>
                    </div>
                    <div>
                        密&nbsp;码：<input type="password" name="userpass" placeholder="" required="" class="input"/>
                    </div>

                    <div>
                        <input type="submit" id="submit" style="align:center" value="注册会员" class="gouwu"/>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <script>
        $(
            function () {
                // 1.获取验证码按钮监听
                $("#zphone").click(
                    function () {
                        // 2.获取输入的邮箱名称
                        {# alert('xxx');#}
                        var plone = $("#plone").val();
                        alert(plone);
                        $.ajax(
                            {
                                url: "/Buyer/send_phone/?plone=" + plone,
                                type: "GET",
                                data: "",
                                success: function (data) {
                                    alert("success!")
                                    console.log(data);
                                }
                            }
                        )
                    }
                )
            }
        )
    </script>
{% endblock %}